<div class="easyui-layout" data-options="fit:true">
    <div data-options="region:'north',title:'过滤条件',collapsible:true" style="height:140px">
        <p>
            <span>
                标题 :
            </span>
            <input id="article-list-query-title" class="easyui-textbox" type="text" name="title" />
            <span>
            </span>
            <span>
                分类:
            </span>
            <input id="article-list-query-category" class="easyui-textbox" type="text" name="category" data-options="prompt:'使用空格隔开不同的分类'"/>
            <span>
            </span>
        </p>
        <p>
            <span>
                更新时间 :
            </span>
            <input id="article-list-query-start" class="easyui-datebox" type="text" name="start" data-options="editable:false" />
            <span>
                - 
            </span>
            <input id="article-list-query-end" class="easyui-datebox" type="text" name="end" data-options="editable:false" />
        </p>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="queryArticles()" data-options="text:'查询'">
        </a>
        <span>
        </span>
        <a href="javascript:void(0)" class="easyui-linkbutton" onclick="resetArticlesQuery()" data-options="text:'清空'">
        </a>
    </div>
    <div data-options="region:'center',title:'列表'">
        <table id="article-list-table">
        </table>
    </div>
</div>
<script type="text/javascript">
    function queryArticles()
    {
        var queryParams = $('#article-list-table').datagrid('options').queryParams;
        queryParams.title = $('#article-list-query-title').textbox('getValue');
        queryParams.category = $('#article-list-query-category').textbox('getValue');
        queryParams.start = $('#article-list-query-start').combobox('getValue');
        queryParams.end = $('#article-list-query-end').datebox('getValue');
        $("#article-list-table").datagrid('options').queryParams = queryParams;
        $("#article-list-table").datagrid('load');
    }
    function resetArticlesQuery()
    {
        $('#article-list-query-title').textbox('reset');
        $('#article-list-query-category').textbox('reset');
        $('#article-list-query-start').datebox('reset');
        $('#article-list-query-end').datebox('reset');
    }
    
    $('#article-list-table').datagrid(
    {
        url: ctx + '/query/articles',
        fit: true,
        type: 'get',
        checkOnSelect: false,
        selectOnCheck: false,
        singleSelect: true,
        pagination: true,
        idField: 'id',
        columns: [[
        {
            field: 'id',
            checkbox: true,
            width: 20
        }, 
        {
            field: 'markdown',
            hidden: true
        }, 
        {
            field: 'title',
            title: '标题',
            width: 400
        }, 
        {
            field: 'category',
            title: '分类',
            width: 100
        }, 
        {
            field: 'createtime',
            title: '创建时间',
            width: 200
        }, 
        {
            field: 'updatetime',
            title: '最后更新时间',
            width: 200
        }]],
        toolbar: [
        {
            iconCls: 'icon-remove',
            text: '删除',
            handler: function()
            {
                if ($('#article-list-table').datagrid('getChecked') == null) 
                {
                    $.messager.alert("通知", "请先选择一条记录");
                    return;
                }
                var checkedItems = $('#article-list-table').datagrid('getChecked');
                var names = [];
                $.each(checkedItems, function(index, item)
                {
                    names.push(item.id);
                });
                $.ajax(
                {
                    url: ctx + "/article/" + names.join('-'),
                    type: 'delete',
                    dataType: 'json',
                    success: function()
                    {
                        $.messager.show(
                        {
                            title: '通知',
                            msg: '删除成功',
                            timeout: 3000,
                            showType: 'slide'
                        });
                        $('#article-list-table').datagrid('load');
                    }
                });
            }
        }, '-', 
        {
            iconCls: 'icon-edit',
            text: '编辑',
            handler: function()
            {
                if ($('#article-list-table').datagrid('getSelected') == null) 
                {
                    $.messager.alert("通知", "请先选择一条记录");
                    return;
                }
                var row = $('#article-list-table').datagrid('getSelected');
                var url;
                if (row.markdown) 
                {
                    addTab(
                    {
                        text: 'markdown编辑',
                        id: row.id,
                        url: '/article/markdown.html'
                    });
                }
                else 
                {
                    addTab(
                    {
                        text: '富文本编辑',
                        id: row.id,
                        url: '/article/add.html'
                    });
                }
            }
        },'-', 
        {
            iconCls: 'icon-edit',
            text: '查看',
            handler: function()
            {
                if ($('#article-list-table').datagrid('getSelected') == null) 
                {
                    $.messager.alert("通知", "请先选择一条记录");
                    return;
                }
                var row = $('#article-list-table').datagrid('getSelected');
                var url;
                window.open(ctx+'/view/article/'+row.id);
            }
        }]
    });
</script>
